<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图书借阅系统前台</title>
    <link rel="icon" href="../static/favicon.ico" th:href="@{/favicon.ico}" type="image/x-icon">
    <!--导入网页图标 -->
    <link rel="shortcut icon" href="../static/favicon.ico" th:href="@{/favicon.ico}" type="image/x-icon">
    <!--导入网页图标 -->
    <script src="../static/lib/jQuery/jquery-3.5.1.min.js" th:src="@{/lib/jQuery/jquery-3.5.1.min.js}"></script>
    <!--导入jQuery库 -->
    <script src="../static/lib/layui/layui.js" th:src="@{/lib/layui/layui.js}"></script>
    <!--导入layUI库 -->
    <script src="../static/lib/cookie/js.cookie-2.2.1.min.js" th:src="@{/lib/cookie/js.cookie-2.2.1.min.js}"></script>
    <!--导入cookie库 -->
    <link rel="stylesheet" href="../static/lib/layui/css/layui.css" th:href="@{/lib/layui/css/layui.css}" media="all">
    <!--导入layUI css库 -->
    <link rel="stylesheet" href="../static/css/common.css" th:href="@{/css/common.css}">
    <!--导入公共的css，其中可定义整个网页的配色方案 -->
    <link rel="stylesheet" href="../static/css/index.css" th:href="@{/css/index.css}">

    <style>

        td {
            height: 56px;
        }
    </style>
</head>

<body>
<div>
    <ul class="layui-nav" lay-filter="" style="position: fixed;top:0;left: 0;right: 0;z-index: 1000;">
        <li class="layui-nav-item"><a href="" id="hover_div" style="font-size:large">&nbsp;图书借阅系统</a></li>

        <li class="layui-nav-item layui-layout-right" style="margin-right: 100px;">
            <a href="javascript:;">
                <img src="../static/images/default.jpg"
                     th:src="${session.user==null?'/images/default.jpg':session.user.picture}" class="layui-nav-img">
                <span th:text="${session.user==null?'未登录':session.user.username}">啊、是你</span>
            </a>
            <dl class="layui-nav-child">
                <dd><a href="" th:href="@{/borrow}">借书管理</a></dd>
                <dd><a href="" th:href="@{/userInfo}">个人中心</a></dd>
            </dl>
        </li>
        <li class="layui-nav-item layui-layout-right"><a href="/loginOut">安全退出</a></li>
    </ul>
</div>

<div style="margin-top:60px;margin-left:200px;margin-right:200px;margin-bottom:60px;height:1500px;">
    <!-- <div class="layui-form-item">
        <div class="layui-input-block">

        </div>
    </div> -->
    <a class="layui-btn layui-btn-normal" style="margin-top: 10px;" href="#" th:href="@{/index}">
        <li class="layui-icon layui-icon-return">返回主页</li>
    </a>
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="200">
            <col width="200">
            <col width="200">
            <col width="200">
            <col width="200">
            <col width="200">
        </colgroup>
        <thead>
        <tr>
            <th>请求编号</th>
            <th>图书编号</th>
            <th>图书名称</th>
            <th>请求类型</th>
            <th>状态</th>
            <th>消息</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="req : ${page.content}">
            <td th:text="${req.id}">啊是你</td>
            <td th:text="${req.book.bookId}">110836</td>
            <td th:text="${req.book.bookName}">人生就像是一场修行</td>
            <td th:text="${req.actionString}">借书</td>
            <td th:text="${req.handleString}">未处理</td>
            <td th:text="${req.message}"></td>
            <td th:if="${req.handleCode==1}">
                <a th:href="@{/request/returnRequest/(bookId=${req.book.bookId})}" class="layui-btn layui-btn-normal">申请还书</a>
            </td>
            <td th:if="${req.handleCode!=1}"></td>
        </tr>
        <!--              <tr>-->
        <!--                <td>啊是你</td>-->
        <!--                <td>110836</td>-->
        <!--                <td>人生就像是一场修行</td>-->
        <!--                <td>借书</td>-->
        <!--                <td>请求被拒绝</td>-->
        <!--                <td>被拒绝的原因</td>-->
        <!--                <td></td>-->
        <!--              </tr>-->
        <!--              <tr>-->
        <!--                <td>啊是你</td>-->
        <!--                <td>110836</td>-->
        <!--                <td>人生就像是一场修行</td>-->
        <!--                <td>借书</td>-->
        <!--                <td>借书成功</td>-->
        <!--                <td>预计还书日期</td>-->
        <!--                <td><button class="layui-btn layui-btn-normal">申请还书</button></td>-->
        <!--              </tr>-->
        <!--              <tr>-->
        <!--                <td>啊是你</td>-->
        <!--                <td>110836</td>-->
        <!--                <td>人生就像是一场修行</td>-->
        <!--                <td>还书</td>-->
        <!--                <td>未处理</td>-->
        <!--                <td></td>-->
        <!--                <td></td>-->
        <!--              </tr>-->
        <!--              <tr>-->
        <!--                <td>啊是你</td>-->
        <!--                <td>110836</td>-->
        <!--                <td>人生就像是一场修行</td>-->
        <!--                <td>还书</td>-->
        <!--                <td>还书成功</td>-->
        <!--                <td></td>-->
        <!--                <td></td>-->
        <!--              </tr>-->
        <!--              <tr>-->
        <!--                <td>啊是你</td>-->
        <!--                <td>110836</td>-->
        <!--                <td>人生就像是一场修行</td>-->
        <!--                <td>还书</td>-->
        <!--                <td>还书失败</td>-->
        <!--                <td></td>-->
        <!--                <td></td>-->
        <!--              </tr>-->
        </tbody>
    </table>

    <input type="hidden" name="page">

    <div style="margin-top:0px;margin-left:0px" th:if="${page.totalPages}>1">
        <button type="button" class="layui-btn" onclick="page(this)"  th:attr="data-page=${page.number}-1" th:unless="${page.first}"><i class="layui-icon layui-icon-left"></i></button>
        <button type="button" class="layui-btn layui-btn-primary" th:text="${page.number+1}">4</button>
        <button type="button" class="layui-btn" onclick="page(this)"  th:attr="data-page=${page.number}+1" th:unless="${page.last}"><i class="layui-icon layui-icon-right"></i></button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

        <span style="font-size:20px;color:cadetblue;line-height: 40px;">共计<b th:text="${page.totalElements}">123</b>条借阅请求记录</span>
    </div>

    <input type="hidden" id="msg" th:value="${msg==null?'':msg}">

</div>
<div th:fragment="admin-footer" class="lms-footer">

    ©2020 版权归武汉理工大学计算机1702"我都行，你们商量吧"小组所有&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <span style="color:rgb(144, 145, 146)">
            技术支持：https://www.layui.com/
        </span>
</div>


<script>
    function page(obj) {
        $("[name='page']").val($(obj).data("page"));
        load();
    }

    function load() {
        window.location.href = "/borrow/?"+"page="+$("[name='page']").val();
    }
    //$('#hover_div').unbind(mouseenter).unbind(mouseleave);
    //JavaScript代码区域
    layui.use(['element', 'layer'], function () {
        var element = layui.element;
        var layer = layui.layer;
        if ($("#msg").val() !== '') {
            layer.msg($("#msg").val());
        }

        //业务代码

        //toDo
    });
</script>

</body>

</html>